<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>
<%@ include file="/WEB-INF/views/shared/taglib.jsp"%>
<%
	request.setAttribute("title", "企业险");
%>
<%@ include file="/WEB-INF/views/shared/master/weContentHeader.jsp"%>
<style type="text/css">
	.title {
		z-index: 0 !important;
	}
	.tab li{
		min-width:120px;
		width:50%;
	}
	.claim-green-pipe{
		width:50%;
		padding: 5px 0px;
	}
	.grid-button {
		width: 24.9%;
	}
	.color-blue {
		color: #2196F3;
	}
	.weui-btn {
		font-size: 0.7rem;
		padding: 0;
		overflow: visible;
	}
	.weui-btn: after {
		border: 0;
	}
	.weui-btn_default {
		background-color: #fff;
	}
	.weui-btn_primary {
		background-color: #017cde;
	}
	.weui-btn_primary:not(.weui-btn_disabled):active {
	  	color: rgba(255, 255, 255, 0.6);
	  	background-color: #017cde;
	}
	.weui-grid {
		padding: 10px 5px;
	}
	.weui-grid:before {
		border: 0;
	}
	.weui-grid:after {
		border: 0;
	}
	.weui-grids {
		background-color: #fbfbfb;
	}
	.weui-grids:before {
		border: 0;
	}
	.icon-float-left {
		float:left; 
		padding: 5px; 
		width: 1.2rem
	}
	.title-nextto-icon{
		margin: 0; 
		padding: 5px; 
		font-size: 0.8rem;
	}
	.bottom-btn {
		margin: 15px;
		padding: 10px;
		background-color: #2196F3;
	}
	.bottom-lab {
		position: fixed;
		bottom: 0;
		background: #fff;
		width: 100%;
		text-align: center;
	}
	.bottom-lab>div {
		margin-bottom: 15px;
	}
</style>
<%@ include file="/WEB-INF/views/shared/master/weTitle.jsp"%>
<div>
	<div class="tab-container" data-id="claim-container" id="claim-tab">
		<ul class="tab tab-horizontal" style="">
			<li data-id="tab1" class="active">
				<span>产品介绍</span>
			</li>
			<li data-id="tab2" class="">
				<span>需求通道</span>
			</li>
		</ul>
	</div>
</div>
<div id="claim-container">
	<div class="tab-content active" id="tab1">
		<div>
			<img style="width:100%;" src="<c:url value='/images/we/enterpriseInsurance/risk.png' />" />
		</div>
		<div class="weui-grids">
			<div class="weui-grid js_grid grid-button color-blue">
				<a href="javascript:;" class="weui-btn weui-btn_default">新品上线</a>
			</div>
			<div class="weui-grid js_grid grid-button">
				<a href="javascript:;" class="weui-btn weui-btn_default">责任险</a>
			</div>
			<div class="weui-grid js_grid grid-button">
				<a href="javascript:;" class="weui-btn weui-btn_default">财产险</a>
			</div>
			<div class="weui-grid js_grid grid-button">
				<a href="javascript:;" class="weui-btn weui-btn_default">建工险</a>
			</div>
			<div class="weui-grid js_grid grid-button">
				<a href="javascript:;" class="weui-btn weui-btn_default">车险</a>
			</div>
			<div class="weui-grid js_grid grid-button">
				<a href="javascript:;" class="weui-btn weui-btn_default">员工福利</a>
			</div>
		</div>	
	</div>
	<div class="tab-content" id="tab2">
		<div style="margin-bottom: 10em">
			<img style="width:100%;" src="<c:url value='/images/we/enterpriseInsurance/risk.png' />" />
			<div>
				<img class="icon-float-left" src=<c:url value="/images/we/enterpriseInsurance/shield.png"/> >
				<div class="weui-cells__title title-nextto-icon">投保人信息</div>
			</div>
			<div class="weui-cells weui-cells_form" style="margin-top: 0;">
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">企业名称:</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="text" placeholder="">
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label for="name" class="weui-label">所属行业:</label>
					</div>
	        		<div class="weui-cell__bd">
	         			<input class="weui-input" id="industry" type="text" value="">
	        		</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">企业地址:</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="text" placeholder="">
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">员工人数:</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="number" placeholder="">
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">平均年龄:</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="number" placeholder="">
					</div>
				</div>
				<div class="weui-cell weui-cell_select weui-cell_select-after">
					<div class="weui-cell__hd">
						<label for="" class="weui-label">有无社保</label>
					</div>
					<div class="weui-cell__bd">
						<select class="weui-select" name="select2">
							<option value="1">有</option>
							<option value="2">无</option>
						</select>
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__bd">
						<textarea class="weui-textarea" placeholder="投保员工职业描述，
						企业所属行业信息，是否有特殊需要描述等" rows="3"></textarea>
						<div class="weui-textarea-counter">
							<span>0</span>/200
						</div>
					</div>
				</div>		
			</div>
			<div>
				<img class="icon-float-left" src=<c:url value="/images/we/enterpriseInsurance/people.png"/> >
				<div class="weui-cells__title title-nextto-icon">办理人联系方式</div>
			</div>
			<div class="weui-cells weui-cells_form" style="margin-top: 0;">
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">姓名:</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="text" placeholder="">
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">手机号:</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="number" placeholder="">
					</div>
				</div>
			</div>
		</div>
		
		<div class="bottom-lab" style="z-index:500;">
			<a href="javascript:;" class="weui-btn weui-btn_primary bottom-btn">立即预约</a>
			<div>客服人员将在一个工作日内与您联系</div>
		</div>
	</div>
</div>


<%@ include file="/WEB-INF/views/shared/scripts/jquery.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/jqweui.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/tabmob.jsp"%>
<script src="<c:url value='/plugins/jqweui/js/swiper.min.js'/>" type="text/javascript"></script>
<script src="<c:url value='/plugins/jqweui/js/city-picker.min.js'/>" type="text/javascript"></script>

<script>
$(function(){
	$(".grid-button").click(function(){
		$(this).children().addClass("color-blue");
		$(this).siblings().children().removeClass("color-blue");
	});
});
</script>

<script>
$("#industry").cityPicker({
    title: "选择所属行业",
    onChange: function (picker, values, displayValues) {
      console.log(values, displayValues);
    }
  });
</script>

<%@ include file="/WEB-INF/views/shared/master/weContentFooter.jsp"%>